import React,{useState} from 'react'
import { useNavigate } from 'react-router-dom'
import { NavBar,DatetimePicker,Field } from 'react-vant'

const Index = () => {
    const navigate=useNavigate()
    const [value, setValue] = useState(new Date())
  return (
    <div>
       <NavBar
      title="疫苗时间表"
      onClickLeft={() => navigate(-1)}
    />
     <DatetimePicker
      popup={{
        round: true,
      }}
      type='date'
      title='选择年月日'
      minDate={new Date(2021, 0, 1)}
      maxDate={new Date(2025, 10, 1)}
      value={value}
      onConfirm={setValue}
    >
      {(val, _, actions) => {
        return (
          <Field
            readOnly
            clickable
            label='选择年月日'
            value={val.toLocaleDateString()}
            placeholder='请选择日期'
            onClick={() => actions.open()}
          />
        )
      }}
    </DatetimePicker>
    </div>
  )
}

export default Index
